<template>
  <div id="patient-list">
  	<div class="page-header">
  		患者列表
  	</div>
	        <el-row style="margin-bottom: 15px" :gutter="20">
          <!--<el-col :span="4">-->
				<!--<el-select v-model="sc_statu" placeholder="请选择评估表类型进行查询">-->
                  <!--<el-option-->
                    <!--v-for="item in sc_status"-->
                    <!--:key="item.value"-->
                    <!--:label="item.text"-->
                    <!--:value="item.value"-->
                  <!--&gt;-->
                  <!--</el-option>-->
              <!--</el-select>-->
              <!--</el-col>-->
              <!--<el-col :span="5">-->
              <!--<el-select v-model="service_type" placeholder="请选择评估表状态进行查询">-->
                  <!--<el-option-->
                    <!--v-for="item in service_types"-->
                    <!--:key="item.value"-->
                    <!--:label="item.text"-->
                    <!--:value="item.value"-->
                  <!--&gt;-->
                  <!--</el-option>-->
              <!--</el-select>-->
          <!--</el-col>-->
			<el-col :span="8">
		                <el-select v-model="bmi_grade" placeholder="请选择患者会员等级进行查询">
                  <el-option
                    v-for="item in grades"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
              </el-select>
			</el-col>
          <el-col :span="12">
              <el-input
                  v-model="paramsData.search_key"
                  placeholder="患者姓名|手机号"
				  @keyup.enter.native="search"
              ></el-input>
              <!--<wt-keyword-search-->
                      <!--placeholders="患者姓名|身份证|手机号|医生姓名"-->
                      <!--:query="service.query_doctor"-->
              <!--&gt;-->

              <!--</wt-keyword-search>-->
          </el-col>
          <el-col :span="2">
              <el-button type="primary" icon="search" @keyup.enter.native="search" @click="search">搜索</el-button>
          </el-col>
      </el-row>
  	<wt-model-table
							:ref="patientList.name" 
							:model="patientList" 
							:params-data="paramsData" 
							:allow-add="false"
							:allow-edit="false"
							:allow-remove="false"
							:auto-load="true"
							:page-size = "pageSize"
							:page-param = "pageParam"
						>
    	<el-table-column
							label="操作"
							fixed="right"
							min-width="80">
						<template scope="scope">
							<!--<el-button v-if="allowRemove" @click="remove(scope.row,scope.$index)" size="small" icon="delete2">删除</el-button>-->
							<router-link :to="{name:'patient-detail',query:{patient_id:scope.row.patient_id}}">
								<el-button  icon="document" size="small">详情</el-button>
							</router-link>
						</template>
			</el-table-column>
    </wt-model-table>
  </div>
</template>

<script>
import Vue from "vue"
import table from 'winged/components/wt-model-table'
import WtPatientClass from '../../Resources/components/wt-patient-class'
import ModelUtils from 'winged/utils/wt-model-utils'
import patientList from '../model/patientList'
import request from 'winged/utils/axios'
import permission from 'winged/utils/wt-permission'
import Code from '../utils/Code'
Vue.component(WtPatientClass.name, WtPatientClass)
export default {
	components:{
		[[table.name]]:table,
		[[WtPatientClass.name]]:WtPatientClass,
	},
	props:{
		pageParam:{
            type: String,
            default:'page_index'
        },
        pageSize:{
            type: Number,
            default: 10
        }
	},
  data: () => ({
  	patientList:patientList,
  	paramsData:{
		user_id:'',
		department_id:'',
		search_key:'',
		sc_status:'',
		current_order_status:'',
		patient_user_id:'',
		bmi_grade:''
	},
    totalSize:0,
    patients: [],
	service_types: [],
	service_type: '',
	sc_status: [],
	sc_statu: '',
	grades:[],
    bmi_grade:''
  }),
  mounted(){
  },
  methods:{
	  search(){
		this.paramsData.sc_status = this.sc_statu;
		this.paramsData.current_order_status = this.service_type;
		this.paramsData.bmi_grade = this.bmi_grade;
		this.$nextTick(() => {
			this.$refs[this.patientList.name].buildExtraParams();
		})
	  }
  },
	created(){
		let arr = [];
		let array = [];
		let newArray = [];
		for (let i = 0; i < this.patientList.service_type.length; i++){
				arr.push({
					text:Code.order_status(this.patientList.service_type[i].current_order_status),
					value:this.patientList.service_type[i].current_order_status
				});
            }
		this.service_types = arr;
		for (let e = 0; e < this.patientList.service_status.length; e++){
			array.push({
				text:Code.sc_status(this.patientList.service_status[e].sc_status),
				value:this.patientList.service_status[e].sc_status
			});
		}
		this.sc_status = array;
        for(let e = 0; e < this.patientList.bmi_grades.length; e++){
            newArray.push({
                label:this.patientList.bmi_grades[e]=="未分组"?this.patientList.bmi_grades[e]:this.patientList.bmi_grades[e]+'会员',
                value:this.patientList.bmi_grades[e]
            })
        }
        this.grades = newArray
	}
}
</script>

<style lang='less'>
	#patient-list{
		.a{
			height:200px;
			background-color:red;
			.b{
				height:100px;
				background-color:blue;
			}
		}
        .el-pagination{
            text-align:center;
        }
		.title {
			font-size: 85px;
		}
		.el-pagination{
			text-align:center;
		}
		.el-select{
			width: 90%
		}
	}
</style>
